<template>
  <van-form @submit="submit" ref="form">
    <van-field
      label="约谈事项"
      required
      v-model="form.PurposeInterview"
      :rules="[{ required: true, message: '请输入约谈事项' }]"
    >
    </van-field>
    <van-field
      label="被约谈对象"
      required
      class="input-tool"
      v-model="form.Interviewee"
      :rules="[{ required: true, message: '请输入约谈对象' }]"
    >
      <template #button>
        <div>
          <span class="color-blue"  @click="userChooseDialogShow=true" 
            >选择人员</span
          ><span class="ml-10 color-blue" @click="deptChooseDialogShow = true"
            >选择部门</span
          ><span
            class="ml-10 color-blue"
            @click="companyChooseDialogShow=true"
            >选择单位</span
          >
        </div>
      </template>
    </van-field>
    <date-picker
      label="约谈时间"
      required
      v-bind:date.sync="form.InterviewTime"
    >
    </date-picker>
    <van-field
      label="约谈地点"
      required
      v-model="form.PlaceInterview"
      :rules="[{ required: true, message: '请输入约谈地点' }]"
    >
    </van-field>
    <van-field
      label="约谈人员"
      required
      v-model="form.InterviewerPeople"
      :rules="[{ required: true, message: '请输入约谈人员' }]"
    >
    </van-field>
    <van-field label="记录人" required v-model="form.NoteTaker"> </van-field>
    <van-field
      label="约谈主要内容"
      required
      v-model="form.MainContentsInterview"
      type="textarea"
    >
    </van-field>
    <van-field
      label="被约谈对象表态"
      required
      v-model="form.IntervieweePosition"
      type="textarea"
    >
    </van-field>
    <eagle-sing-list
      label="被约谈人确认（签字）"
      :value.sync="form.ConfirmedSignature"
    ></eagle-sing-list>
    <eagle-sing-list
      label="约谈人（签字）"
      :value.sync="form.SignatureInterviewer"
    ></eagle-sing-list>
    <div class="btns m-10">
      <van-button block type="info"> 提交 </van-button>
    </div>

    <user-choose-dialog
      title="选择人员"
      :show.sync="userChooseDialogShow"
      :isMulti="true"
      @callback="userChooseCallback"
    >
    </user-choose-dialog>

    <user-org-choose-dialog
      :show.sync="deptChooseDialogShow"
      @callback="deptChooseCallback"
    >
    </user-org-choose-dialog>

    <user-company-choose-dialog
      :show.sync="companyChooseDialogShow"
      @callback="companyChooseCallback"
    >
    </user-company-choose-dialog>
  </van-form>
</template>

<script>
import EagleSingList from "../../../components/eagle-sing-list.vue";
import UserChooseDialog from "@/views/components/user/userChooseDialog.vue";
import UserOrgChooseDialog from "@/views/components/department/departmentChooseDialog.vue";
import UserCompanyChooseDialog from "@/views/components/user/userCompanyChooseDialog.vue";

export default {
  components: {
    EagleSingList,
    UserChooseDialog,
    UserOrgChooseDialog,
    UserCompanyChooseDialog,
  },
  data() {
    return {
      id: this.$route.query.id,
      form: {},
      imgUrlList: [],
      imgUrlList2: [],
      userChooseDialogShow: false,
      deptChooseDialogShow: false,
      companyChooseDialogShow: false,
    };
  },
  created() {
    if (this.$route.query.id) {
      this.getDetail();
    } else {
      this.initNewEntity();
    }
  },
  methods: {
    empty(index) {
      this.imgUrlList.splice(index, 1);
    },
    getDetail() {
      let params = { id: this.id };
      this.$axios
        .get(this.$constUrl.GX_InterviewRecord_GetDetail, { params: params })
        .then((res) => {
          this.form = res.data;
        });
    },
    initNewEntity() {
      this.$axios
        .get(this.$constUrl.GX_InterviewRecord_InitNewEntity, {})
        .then((res) => {
          this.form = res.data;
        });
    },
    submit() {
      this.$refs.form.validate().then(() => {
        if (this.$route.params.id == 0) {
          this.$axios
            .post(this.$constUrl.GX_InterviewRecord_Add, this.form)
            .then((res) => {
              this.$toast.success("新增成功");
              this.$router.push("/GxInterviewRecord");
            });
        } else {
          this.$axios
            .post(this.$constUrl.GX_InterviewRecord_Update, this.form)
            .then((res) => {
              this.$toast.success("保存成功");
              this.$router.push("/GxInterviewRecord");
            });
        }
      });
    },
    userChooseCallback(data) {
      this.form.Interviewee = "";
      if(data && data.length){
        let names = data.map((x)=>{
          return x.ChnName
        })
        this.form.Interviewee = names.join();
      }
    },
    deptChooseCallback(data) {
      this.form.Interviewee = data.OrgName;
    },
    companyChooseCallback(data) {
      this.form.Interviewee = data.CompanyName;
      this.companyChooseDialogShow = false;
    },
    companyChooseShow(){
      
      this.companyChooseDialogShow = true;
    }
  },
};
</script>

<style scoped>
.input-bottom-tool {
  left: 100px;
  top: 30px;
}
</style>

